<template>
	<view class="connect">
		<u-navbar back-text=" " :title="title"></u-navbar>
		<view class="form_item">
			<view class="form_item_title">包裹信息</view>
			<view class="form_item_info">
				<view class="form_item_info_input">
					
					<view>
						<span style="color: #FF0000;font-size: 24rpx;" >*</span>
						<span>快递单号</span>
					</view>
					<input class="form_input" maxlength="30"  v-model="info.code"  placeholder="请输入快递单号" />
					<!-- <image style="width: 21rpx;margin-left: 22rpx;" src="https://www.mengkahuyu.com/index_png/back.png" mode="widthFix" alt="" /> -->
				</view>
				<view @click="openPop" class="form_item_info_input" style="border: none;">
					<view>
						<span style="color: #FF0000;font-size: 24rpx;" >*</span>
						<span>仓库所在区</span>
					</view>
					<text  class="form_input" style="color: #808080;">{{addressType}}</text>
					<image style="width: 21rpx;height: 12rpx; margin-left: 22rpx;" src="https://www.mengkahuyu.com/index_png/back.png" mode="widthFix" alt="" />
				</view>
			</view>
		</view>	
		<view class="form_item">
			<view class="form_item_title">物品信息</view>
			<view v-for="(item,index) in info_list" :key="index" class="form_item_info" style="margin-bottom: 16rpx;">
				<view class="form_item_info_input" >
					<view>
						<span  style="color: #FF0000;font-size: 24rpx;" >*</span>
						<span>中文品名</span>
					</view>
					<input class="form_input" v-model="info_list[index].name" type="text" placeholder="请输入中文品名" />
					<!-- <image style="width: 21rpx;margin-left: 22rpx;" src="https://www.mengkahuyu.com/index_png/back.png" mode="widthFix" alt="" /> -->
				</view>
				<view class="form_item_info_input">
					<view>
						<span style="color: #FF0000;font-size: 24rpx;" >*</span>
						<span>单价</span>
					</view>
					<input maxlength="10" v-model="info_list[index].price" @input="inputChange($event , index)" class="form_input" type="digit" placeholder="请输入单价" />
				</view>
				<view class="form_item_info_input">
					<view>
						<span style="color: #FF0000;font-size: 24rpx;" >*</span>
						<span>数量</span>
					</view>
					<input maxlength="8" v-model="info_list[index].num" class="form_input" type="number" placeholder="请输入数量" />
				</view>
				<view v-if="info_list.length > 1" @click="delInfo(index)" class="form_item_info_add">
					<image style="width: 24rpx; height: 24rpx;margin-right: 16rpx;" src="https://www.mengkahuyu.com/index_png/close.png" mode=""></image>
					<span class="add_text">删除</span>
				</view>
				<view v-if="info_list.length-1 == index" @click="addInfo" class="form_item_info_add">
					<image style="width: 24rpx; height: 24rpx;margin-right: 16rpx;" src="https://www.mengkahuyu.com/index_png/add_icon.png" mode=""></image>
					<span class="add_text">添加物品信息</span>
				</view>
			</view>
			
			
		</view>
		<!-- <view class="form_item">
			<view class="form_item_title">增值服务</view>
			<view class="form_item_info">
				<view class="radios_item" @click="chooseRadio(index)" v-for="(item,index) in radioList" :key="index">
					<image v-if="!item.isChoose" style="width: 32rpx;height: 32rpx;" src="https://www.mengkahuyu.com/index_png/checkBox.png" mode="widthFix"></image>
					<image v-else style="width: 32rpx;height: 32rpx;" src="https://www.mengkahuyu.com/index_png/checkBox_choose.png" mode="widthFix"></image>
					<span class="radio_title">{{item.name}}({{item.price}})</span>
				</view>
				
			</view>
		</view> -->
		<view class="form_item">
			<view class="form_item_title">备注</view>
			<view class="form_item_info">
				<textarea placeholder="请输入备注"  v-model="info.remark" style="width: 100%;" class="textarea" name="" id="" maxlength="150" cols="30" rows="5"></textarea>
			</view>
		</view>
		<view style="width: 100%; height: 200rpx;">
				
		</view>
		<view v-if="order_id>0" class="button_submit">
			<u-button @click="onSubmit(2)" class="btns" :custom-style="{'background':'#90c0ff' ,color:'#fff'}"  :shape="'circle'" :hair-line="false" :ripple="true" ripple-bg-color="rgba(9, 82, 200, 0.15)">修改</u-button>
		</view>
		<view v-if="id != 0" class="button_submit">
			<u-button @click="onSubmit(3)" class="btns" :custom-style="{'background':'#90c0ff' ,color:'#fff'}"  :shape="'circle'" :hair-line="false" :ripple="true" ripple-bg-color="rgba(9, 82, 200, 0.15)">认领</u-button>
		</view>
		<view v-if="id==0 && order_id==0" class="button_submit">
			<u-button @click="onSubmit(1)" class="btns" :custom-style="{'background':'#90c0ff' ,color:'#fff'}"  :shape="'circle'" :hair-line="false" :ripple="true" ripple-bg-color="rgba(9, 82, 200, 0.15)">添加</u-button>
		</view>
		<!-- <view class="" @click="dignyu">
			授权
		</view> -->
		<u-action-sheet :list="list" @click="onchange" v-model="pop_show"></u-action-sheet>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title:'包裹预报',
				order_id:0,
				id:0,
				pop_show:false,
				type:null,
				list:[
					{text:'韩国仓库' , type:1},
					{text:'日本仓库' , type:2},
				],
				kor_type:'',
				addressType:'请选择',//仓库国家
				info_list:[
					{
						"name": null, //名称
						"price": null, //价格
						"num": null //数量
					},
				],
				info:{
					"code": null, //快递单号
					"type": null, //1韩国 2日本
					"item_info": [], //物品信息	
					"remark": null,
					"sid": null //增值服务id
				},
				radioList:[
					
				]
			}
		},
		onLoad(parame) {
			this.kor_type = uni.getStorageSync('kor_type')
			
			if(parame.id){
				this.id = parame.id
				this.title = '包裹认领'
			}
			if(parame.order_id){
				this.order_id = parame.order_id
				this.getInfo()
				this.title = '包裹详情'
			}
		},
		onShow() {
			var token = uni.getStorageSync('token')
			this.kor_type = uni.getStorageSync('kor_type')
			// console.log(this.kor_type)
			if(!token){
				uni.setStorageSync('isModule' , true)
				uni.showModal({
					title: '登录',
					content: '登录后可使用完整功能',
					cancelText: "取消", // 取消按钮的文字  
					confirmText: "确认", // 确认按钮的文字  
					showCancel: true, // 是否显示取消按钮，默认为 true
					success: (res) => {
						uni.setStorageSync('isModule' , false)
					if(res.confirm) {  
						// console.log('comfirm') //点击确定之后执行的代码
						uni.navigateTo({
							url:'/pages/login/login'
						})
					} else {  
						uni.switchTab({
							url:'/pages/index/index'
						})
						}  
					} 
				})
				return
			}
			if(this.kor_type == 'chn'){
				this.list = [
					{text:'中国威海仓库' , type:1},
				]
			}
			// this.getradioList()
		},
		methods: {
		
			inputChange(e, index){	
				this.$nextTick(()=>{
					this.info_list[index].price = this.$geShi(e.detail.value)
				})
				
			},
			getInfo(){
				// 获取包裹闲情
				var data = {
					id:this.order_id
				}
				if(this.kor_type=='kor'){
					this.$wqzApi.Order_detail(data).then(res=>{
						this.info = res.data
						this.info_list = res.data.item_info
						this.type = 2
						this.addressType = res.data.type==1?'韩国仓库':'日本仓库'
					})
				}else{
					this.$wqzApi.kor_Order_detail(data).then(res=>{
						this.info = res.data
						this.info_list = res.data.brand
						this.type = 2
						this.addressType = res.data.type==1?'中国威海仓库':''
					})
					
				}
				
			},
			dignyu(){
				return new Promise((resolve, reject) => {
					wx.requestSubscribeMessage({
					    tmplIds: [
							'bjb55ZIOo1z7CjLTXkkqVSd_fe6WJLaqIjxtmihuZTI', //物流消息提醒
							'LL09Z07c3pLTnLQotLfD8DYQm9SB6A-QQ1QW3eBop2M',//支付消息提醒
						],
					    success(res) {
							resolve(true)
					    },
						fail(err) {
							resolve(false)
						}
					})
				})
			},
			onSubmit(type){
				// type 1新增 2认领
				var that = this
				var isOk = true //是否将物品信息全部完善
				this.info.item_info = this.info_list
				this.info.item_info.forEach((item,index)=>{
					for(var key in item){
						if(!item[key]){
							isOk = false
						}
					}
				})
				if(!this.info.code){
					uni.showToast({
						title:"请输入快递单号",
						icon:'none'
					})
					return
				}
				if(!this.info.type){
					uni.showToast({
						title:"请选择仓库所在地",
						icon:'none'
					})
					return
				}
				if(this.info.item_info.length<1){
					uni.showToast({
						title:"物品信息不能为空",
						icon:'none'
					})
					return
				}
				if(!isOk){
					uni.showToast({
						title:"请完善物品信息",
						icon:'none'
					})
					return
				}
				if(type==1){
					// 新增/
					this.dignyu().then(res=>{
						if(this.kor_type=='kor'){
							
							this.$wqzApi.Order_order_add(this.info).then(res=>{
								uni.showToast({
									title:'预报成功'
								})
							})
							setTimeout(()=>{
								uni.redirectTo({
									url:`/pages/packageList/packageList?type=${this.info.type}&current=0`
								})
							},1500)
						}else{
							this.$wqzApi.kor_Order_order_add(this.info).then(res=>{
								uni.showToast({
									title:'预报成功'
								})
							})
							setTimeout(()=>{
								uni.redirectTo({
									url:`/pages/packageList/packageList_zh?type=${this.info.type}&current=0`
								})
							},1500)
						}
					})
					// 新增	
				}
				if(type==3){
					// 包裹认领
					this.dignyu().then(res=>{
						this.info.id = this.id
						if(this.kor_type=='kor'){
							this.$wqzApi.Order_ClaimAdd(this.info).then(res=>{
								uni.showToast({
									title:'认领成功'
								})
								setTimeout(()=>{
									uni.redirectTo({
										url:`/pages/packageList/packageList?type=${this.info.type}&current=1`
									})
								},1500)	
							})
						}else{
							this.$wqzApi.kor_Order_ClaimAdd(this.info).then(res=>{
								uni.showToast({
									title:'认领成功'
								})
								setTimeout(()=>{
									uni.redirectTo({
										url:`/pages/packageList/packageList_zh?current=1`
									})
								},1500)
							})
						}
					})
				}
				if(type==2){
					// 修改预报订单
					uni.showModal({
						title: '提示',//标题
						content: "确认修改",//提示内容可以加入\r\n进行换行
						showCancel: true,//是否显示取消按钮，默认为true
						cancelText: '取消',//取消按钮的文字
						confirmText: '确定',//确认按钮的文字
						success: res => {
							if (res.confirm) { //点击确定之后执行的代码
								if(this.kor_type=='kor'){
									that.$wqzApi.Order_order_add(that.info).then(res=>{
										uni.showToast({
											title:'修改成功'
										})
									})
									setTimeout(()=>{
										uni.navigateBack()
									},1500)
								}else{
									that.$wqzApi.kor_Order_order_add(that.info).then(res=>{
										uni.showToast({
											title:'修改成功'
										})
									})
									setTimeout(()=>{
										uni.navigateBack()
									},1500)
								}
								
							}
						},
						fail: () => {},
						complete: () => {}
					});
					
					
				}
				// console.log(type)
			},
			getradioList(){
				// 获取增值服务列表
				
				if(this.order_id ){
					this.$wqzApi.index_service({}).then(res=>{
						res.data.forEach((item,index)=>{
							res.data[index].isChoose = false
						})
						this.radioList = res.data
						this.getInfo()
					})
					
				}else{
					this.$wqzApi.index_service({}).then(res=>{
						res.data.forEach((item,index)=>{
							res.data[index].isChoose = false
						})
						this.radioList = res.data
					})
				}
				if(this.id){
					// this.getInfo()
				}
				
			},
			openPop(){
				this.pop_show = true
				
			},
			onchange(e){
				this.info.type = this.list[e].type
				this.addressType = this.list[e].text
			},
			addInfo(){
				var data = {
					"name": null, //名称
					"price": null, //价格
					"num": null //数量
				}
				this.info_list.push(data)
			},
			delInfo(index){
				this.info_list.splice(index , 1)
			},
			chooseRadio(key){
				this.radioList.forEach((item,index)=>{
					if(index==key){
						this.radioList[index].isChoose = !this.radioList[index].isChoose 
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url(./index.scss);
</style>
